<template>
  <div class="total">
    <el-row
      type="flex"
      justify="space-around"
      style="align-items: center; margin-top: 20px"
    >
      <el-card>
        <el-container v-if="!isdone">
          <el-header
            ><img class="logo" src="../../assets/logo2.png" alt="" />
            <h3 style="text-align: center">加入东杰智能企业钉钉</h3></el-header
          >
          <el-main>
            <el-form ref="form" :model="form" label-position="top">
              <el-form-item label="手机号">
                <el-input v-model="form.mobile"></el-input>
                <span style="color: crimson"
                  >请检查是否为注册钉钉时使用的手机号，否则将无法收到邀请</span
                >
              </el-form-item>

              <el-form-item>
                <el-button type="primary" @click="onSubmit" style="width: 100%"
                  >申请加入钉钉</el-button
                >
              </el-form-item>
            </el-form></el-main
          >
        </el-container>

        <el-container v-if="isdone">
          <el-header
            ><img class="logo" src="../../assets/logo2.png" alt="" />
          </el-header>
          <el-main>
            <h3>钉钉邀请发送成功</h3>
            <p>
            邀请已成功发送，请您打开钉钉加入企业，并找到工作台内的“新员工入职指引”应用，根据指引完成后入入职流程
          </p></el-main>
        </el-container>
      </el-card>
    </el-row>
  </div>
</template>

<script>
export default {
  created() {
    this.getUrlKey();
  },
  data() {
    return {
      form: [],
      isdone: false,
    };
  },
  methods: {
    getUrlKey() {
      var url = window.location.href; //获取当前url
      this.nowurl = url;
      var dz_url = url.split("#")[0]; //获取#/之前的字符串
      var cs = dz_url.split("?")[1]; //获取?之后的参数字符串
      var cs_arr = cs.split("&"); //参数字符串分割为数组
      var cs = {};
      for (var i = 0; i < cs_arr.length; i++) {
        //遍历数组，拿到json对象
        cs[cs_arr[i].split("=")[0]] = cs_arr[i].split("=")[1];
      }
      this.form.id = cs.id;
      this.form.mobile = cs.mobile;
    },

    onSubmit() {
      let datas = {
        id: this.form.id,
        mobile:this.form.mobile,
      };

      this.$axios
        .post("api/interview/enterdingtalk", datas)
        .then((response) => {
          this.$notify({
            title: "加入钉钉",
            message: response.data.msg,
            duration: 1500,
          });
          this.isdone = response.data.isdone;
        })
        .catch(function (error) {
          console.log(error);
        });
    },
  },
};
</script>

<style >
</style>